import React from 'react';
import {Card,Button,Spin,Icon,Alert} from 'antd';
import './ui.less';

export default class Loadings extends React.Component{
  render(){
    const  icon= <Icon type="loading"/>
    return (
      <div>
        <Card title="Spin使用" className="card_wrapper">
          <Spin size="small"/>
          <Spin />
          <Spin size="large"/>
          <Spin indicator={icon}/>
        </Card>
        <Card title="内容遮罩" className="card_wrapper">
          <Alert message="React" description="欢迎使用antd Alert" type="info" />
          <Spin>
            <Alert message="React" description="欢迎使用antd Alert" type="error"/>
          </Spin>
          <Spin tip="加载中...">
            <Alert message="React" description="欢迎使用antd Alert" type="warning"/>
          </Spin>
          <Spin tip="加载中..." indicator={icon}>
            <Alert message="React" description="欢迎使用antd Alert" type="warning"/>
          </Spin>
        </Card>
      </div>
    )
  }
}